<template>
	<view class="page_view">
		<view class="zhanwei"></view>
		<view class="top_view flex">
			<image src="https://bucketoss10086.oss-cn-beijing.aliyuncs.com/images/qiandao.png" class="top_view_qaindao" mode=""></image>
			<view class="top_view_min">每日签到领积分「当前385积分」</view>
			<view class="top_view_right">签到</view>
		</view>
		<view class="zhanwei"></view>
		<scroll-view scroll-y="true" class="scroll" :style="{ height: scrollH + 'px' }">
			<view class="list">
				<view class="list_item" v-for="(item,index) in list" @click="go_detail(item.id)">
					<image :src="ImgUrl + item.img[0]" class="list_item_img" mode="widthFix"></image>
					<view class="list_item_bottom">
						<view class="list_item_sesc">{{item.name}}</view>
						<view class="list_item_price">
							{{item.score}}
							<text class="fs-28">积分</text>
							<text style="margin: 0 10rpx;">+</text>
							{{ item.price | pointsPrice }}
							<text class="fs-28">.{{ jiage | pointsPrice(1) }}</text>
							<text class="fs-28">元</text>
						</view>
					</view>
				</view>
			</view>
		</scroll-view>
	</view>
</template>

<script>
	import { score_goods } from '../../api/common.js';
import getScrollHeight from '@/utils/utils.js'; //获取余下的高度
import { pointsPrice } from '@/utils/util1.js';
export default {
	data() {
		return {
			scrollH: '',
			page: 1, // 当前页数
			isLoading: false ,// 是否正在加载数据
			jiage:12.80,
			list:[]
		};
	},
	onReady() {
		let t = this;
		getScrollHeight.getScrollHeight('scroll').then((res) => {
			t.scrollH = res - 10;
		});
	},
	filters: {
		pointsPrice
	},
	computed:{
		ImgUrl(){
			console.log(this.$store.state.ImgUrl)
			return this.$store.state.ImgUrl
		},
	},
	onLoad() {
		this.getList();
	},
	methods: {
		getList(){
			score_goods().then(res=>{
				if(res.code == 200001){
					this.list = res.data.data;
				}
			})
		},
		go_detail(id){ 
			uni.navigateTo({
				url:'/pages/PointsMall/PointsMallDetail/PointsMallDetail?id=' + id
			})
		}
		
	}
};
</script>

<style>
page {
	background: #f6f6f6;
}
.zhanwei {
	width: 100%;
	height: 10rpx;
}
.page_view {
	width: 100%;
	padding: 0 30rpx;
	box-sizing: border-box;
}
.top_view {
	width: 100%;
	padding: 20rpx 30rpx;
	box-sizing: border-box;
	border-radius: 12rpx;
	background: #fff8eb;
}
.top_view_qaindao {
	width: 44rpx;
	height: 44rpx;
}
.top_view_min {
	color: #f08f08;
	font-family: Alibaba PuHuiTi 2;
	font-size: 28rpx;
	font-weight: 400;
	margin-left: 20rpx;
}
.top_view_right {
	display: inline-flex;
	padding: 8rpx 20rpx;
	border-radius: 12rpx;
	background: #f79611;
	color: #fff;
	font-family: Alibaba PuHuiTi 2;
	font-size: 24rpx;

	font-weight: 400;
}
.list {
	width: 100%;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.list_item {
	width: 330rpx;
	background: #fff;
	border-radius: 12rpx;
	margin-top: 30rpx;
}
.list_item_img {
	width: 100%;
	border-radius: 12rpx 12rpx 0 0;
}
.list_item_sesc {
	color: #333;
	font-family: Alibaba PuHuiTi 2;
	font-size: 28rpx;
	font-weight: 400;
}
.list_item_bottom {
	padding: 20rpx 16rpx;
	box-sizing: border-box;
}
.list_item_price{
	color: #E5432E;
	font-family: Alibaba PuHuiTi 2.0;
	font-size: 40rpx;
	font-weight: 600;
}
.fs-28{
	font-size: 28rpx;
}
</style>
